<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <title>用户-区域配置</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--字体-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--图标-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <!--插件样式-->
    <link href="/dist/plugins/ztree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/dist/plugins/webuploader-0.1.5/webuploader.css">
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=86e2297f">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=222aea35">
    <style>
        .userBox{
            width: 100%;
            min-height: 200px;
            border:1px dashed #ddd;
            margin:10px 0;
            font-size: 14px;
            padding: 20px 0;
            text-align: left;
            line-height: 24px;
            height: auto;
            position: inherit;
        }
    </style>
</head>
<body>

<section class="content text-center" id="app">
    <div class="row">
    <div class="box-body no-padding box-border col-md-5" style="overflow: auto;background: #f7f8fa;">
        <ul class="ztree" id="ulRegion" style="height: 470px;overflow-y: auto"></ul>
    </div>

    <div class="col-md-1"></div>
    <div class="col-md-6">
        <div style="text-align: center;color:#333;font-weight: bold;">已选人员</div>
        <div class="userBox"></div>
        <div class="clearfix"></div>
    </div>
        <div class="clearfix"></div>

    </div>
    <input type="button" value="添加" id="btnSave" class="btn oaBtn"
           style="margin:10px 0;">
</section>

<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<!--插件JS-->
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<!--框架已定义 JS-->
<script src="/dist/js/app_iframe.js?t=8e743a31"></script>
<!--oa自定义  JS-->
<script src="/dist/js/oa.js?t=54c6b89c"></script>

<script src="https://file.ggxqce.com/web/vue.min.js"></script>
<!--ztree组件所需js-->
<script type="text/javascript" src="/dist/plugins/ztree/js/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript" src="/dist/plugins/ztree/js/jquery.ztree.exhide-3.5.js"></script>
<script type="text/javascript">
</script>
<script>
    var service = {
        getById: function (emailId, callback) {
            $.ajax({
                url: server.ip + '/email/findInboxDetail.json',
                data: JSON.stringify({
                    emailId: emailId,
                    userId: getCurrentUser().id
                }),
                success: function (r) {
                    callback(r.data.sendData);
                }
            });
        },
        getOrgNodes: function (callback) {
            $.ajax({
                url: server.ip + "/email/getOrgInbox.json",
                data: JSON.stringify({
                    userId: getCurrentUser().id
                }),
                success: function (r) {
                    callback(r.data.sendData);

                }
            });
        }
    };
</script>
<script type="text/javascript">
    $(function () {
        var type=$.wyui.page.urlParams.type
        var zTreeRegion_setting = {
            view: {
                showIcon: function (treeId, treeNode) {
                    return treeNode.isParent;
                }
            },
            data: {
                simpleData: {
                    enable: true
                }
            },
            check: {
                chkboxType: { "Y": "ps", "N": "ps" },
                enable: true
            },
            callback: {
                onCheck: zTreeOnCheck
            }
        };
        var treeObj='';
        service.getOrgNodes(function (nodes) {
            treeObj = $.fn.zTree.init($("#ulRegion"), zTreeRegion_setting, nodes);
        });
        $("#btnSave").on("click",function () {
            var receivers = new Array();
            var Nodes = treeObj.getCheckedNodes(true);

            for (var i = 0; i < Nodes.length; i++) {
                if(Nodes[i].type == "user") {
                    receivers.push({userId: Nodes[i].id, userName: Nodes[i].name});
                }
            }
            if(type=="receivers"){
                parent.vueApp.email.receivers = receivers;
            }else{
                parent.vueApp.email.copiers = receivers;
            }
            var api = frameElement.api, W = api.opener;
            api.close();
        });
        function zTreeOnCheck(treeId, treeNode) {
            console.log(treeNode);
            var receivers = new Array();
            var Nodes = treeObj.getCheckedNodes(true);
            for (var i = 0; i < Nodes.length; i++) {
                if(Nodes[i].type == "user") {
                    receivers.push(Nodes[i].name+"; ");
                }
            }
            console.log(receivers);
            $(".userBox").html(receivers)
        };
    });
</script>
</body>
</html>
